<template>
	<view class="load">
		<div class="load-content">
			<image src="../../../static/images/load.gif" mode=""></image>
			<text>加载中...</text>
		</div>
	</view>
</template>

<script>
	export default {

		data() { 
			return {

			};
		},
		props: {
			brColor: {
				type: String,
				default: '#fff'
			}
		},
		computed: {
			brColors() {
				return `background-color: ${this.brColor}`
			}
		}
	}
</script>

<style lang="scss" scoped>
	.load {
		display: flex;
		justify-content: center;
		align-items: center;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1000;
		background-color: rgba(#000,.3);

		.load-content {
			display: flex;
			background-color: #fff;
			width: 310upx;
			height: 250upx;
			margin-bottom: 200upx;
			border-radius: 20upx;
			justify-content: center;
			flex-direction: column;
			align-items: center;

			>image {
				width: 70upx;
				height: 70upx;
				background-color: #8F8F94;
			}

			>text {
				font-size: 25upx;
				color: #999999;
				margin-top: 30upx;
			}
		}
	}
</style>
